<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
  xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
  xmlns:tr="http://myfaces.apache.org/trinidad" xmlns:a4j="http://richfaces.org/a4j"
  xmlns:rich="http://richfaces.org/rich">

<ui:composition template="/templates/main.xhtml">

  <ui:define name="content">


    <!-- Next form contains the master list where each row has 2 links to trigger
         update and remove.  Out side of the list, has an add link to add new school.
         All links are ajaxed to render the school detail
         
         Submitting the school detail form triggers a full page reload ( ie no ajax )
     -->

    <tr:form id="listWrapper">

      <tr:panelCaptionGroup >

        <tr:table id="list" value="#{mainSchoolList.mainSchools}" var="school" width="900px" rows="25"
          rowBandingInterval="1">

          <f:facet name="header">
            <tr:outputText value="#{base['school.main']}" />
          </f:facet>

          <tr:column width="7">
            <f:facet name="header">
              <tr:outputText value="#{base['crud.modify.short']}" />
            </f:facet>
            <tr:goLink  id="prepareEdit" destination="mainSchools.jspx?id=#{school.id}&amp;action=#{base['crud.modify.short']}" >
              <tr:image source="/images/edit.gif" border="0" />
            </tr:goLink>
          </tr:column>
          
          <!--
          <tr:column width="7">
            <f:facet name="header">
              <tr:outputText value="#{base['crud.modify.short']}" />
            </f:facet>
            <tr:commandLink id="prepareEdit" partialSubmit="true" immediate="true" action="#{schoolDetail.selectSchool}">
              <f:setPropertyActionListener value="#{school.id}" target="#{schoolDetail.id}" />
              <f:setPropertyActionListener value="#{base['crud.modify']}" target="#{schoolDetail.action}" />
              <tr:image source="/images/edit.gif" border="0" />
            </tr:commandLink>
          </tr:column>
          -->

          <tr:column width="7">
            <f:facet name="header">
              <tr:outputText value="#{base['crud.remove.short']}" />
            </f:facet>
            <tr:commandLink id="prepareDel" partialSubmit="true" immediate="true" action="#{schoolDetail.selectSchool}">
              <f:setPropertyActionListener value="#{school.id}" target="#{schoolDetail.id}" />
              <f:setPropertyActionListener value="#{base['crud.remove']}" target="#{schoolDetail.action}" />
              <tr:image source="/images/delete.gif" border="0" />
            </tr:commandLink>
          </tr:column>

          <tr:column sortProperty="name" sortable="true">
            <f:facet name="header">
              <h:outputText value="#{base['school.name']}" />
            </f:facet>
            <h:outputText value="#{school.name}" />
          </tr:column>

          <tr:column sortProperty="description" sortable="true">
            <f:facet name="header">
              <h:outputText value="#{base['school.description']}" />
            </f:facet>
            <tr:outputText value="#{school.description}" />
          </tr:column>

        </tr:table>

        <tr:spacer width="1" height="20" />

        <tr:commandLink id="prepareAdd" partialSubmit="true" immediate="true" action="#{schoolDetail.selectSchool}">
          <f:setPropertyActionListener value="#{base['crud.add']}" target="#{schoolDetail.action}" />
          <h:outputText value="#{base['crud.add']}" />
        </tr:commandLink>

      </tr:panelCaptionGroup>

    </tr:form>

    <rich:spacer width="1" height="20" />

    <tr:panelGroupLayout id="schoolDetails"
      partialTriggers=" :::::list:prepareEdit :::::list:prepareDel :::::prepareAdd persist">

      <tr:form id="detailWrapper">

        <tr:panelCaptionGroup captionText="#{base['school.detail']}" rendered="#{schoolDetail.rendered}">
          <tr:panelFormLayout rows="7" labelWidth="20%" fieldWidth="67%">
            <h:inputHidden id="selectedId" value="#{schoolDetail.id}" />
            <h:inputHidden id="action" value="#{schoolDetail.action}" />
            <tr:inputText required="true" columns="30" label="#{base['school.name']}"
              value="#{schoolDetail.school.name}" disabled="#{schoolDetail.readOnly}" />
            <tr:spacer width="1" height="10" />
            <tr:inputText columns="60" label="#{base['school.description']}" value="#{schoolDetail.school.description}"
              disabled="#{schoolDetail.readOnly}" />

            <tr:spacer width="1" height="10" />

            <tr:commandLink partialSubmit="false" id="persist" text="#{schoolDetail.action}"
              action="#{schoolDetail.persistSchool}" />

          </tr:panelFormLayout>
        </tr:panelCaptionGroup>

      </tr:form>

    </tr:panelGroupLayout>
    
    <tr:panelGroupLayout>
      <tr:form>
          <tr:panelTabbed >
            <tr:showDetailItem text="Tab 1">
              <tr:panelHeader text="Header 1">
                <tr:panelFormLayout>
                  <tr:inputText readOnly="true" label="Label 1-1" value="Value"
                                styleClass="AFFieldTextMarker"/>
                  <tr:inputText readOnly="true" label="Date/Time from last partial refresh"
                                value="#{date.currentDate}" styleClass="AFFieldTextMarker">
                    <tr:convertDateTime pattern="EEEEEEEEE, ddMMMyyyy, HH:mm:ss z"/>
                  </tr:inputText>
                </tr:panelFormLayout>
              </tr:panelHeader>
            </tr:showDetailItem>
            <tr:showDetailItem text="Tab 2">
              <tr:panelHeader text="Header 2">
                <tr:panelFormLayout>
                  <tr:inputText readOnly="true" label="Label 2-1" value="Value"
                                styleClass="AFFieldTextMarker"/>
                  <tr:inputText readOnly="true" label="Date/Time from last partial refresh"
                                value="#{date.currentDate}" styleClass="AFFieldTextMarker">
                    <tr:convertDateTime pattern="EEEEEEEEE, ddMMMyyyy, HH:mm:ss z"/>
                  </tr:inputText>
                </tr:panelFormLayout>
              </tr:panelHeader>
            </tr:showDetailItem>
            <tr:showDetailItem text="Tab 3" disclosed="true">
              <tr:panelHeader text="Header 3">
                <tr:panelFormLayout>
                  <tr:inputText readOnly="true" label="Label 3-1" value="Value"
                                styleClass="AFFieldTextMarker"/>
                  <tr:inputText readOnly="true" label="Date/Time from last partial refresh"
                                value="#{date.currentDate}" styleClass="AFFieldTextMarker">
                    <tr:convertDateTime pattern="EEEEEEEEE, ddMMMyyyy, HH:mm:ss z"/>
                  </tr:inputText>
                </tr:panelFormLayout>
              </tr:panelHeader>
            </tr:showDetailItem>
            <tr:showDetailItem text="Tab 4" disabled="true"/>
            <tr:showDetailItem text="Tab 5">
              <tr:panelHeader text="Header 5">
                <tr:panelFormLayout>
                  <tr:inputText readOnly="true" label="Label 5-1" value="Value"
                                styleClass="AFFieldTextMarker"/>
                  <tr:inputText readOnly="true" label="Date/Time from last partial refresh"
                                value="#{date.currentDate}" styleClass="AFFieldTextMarker">
                    <tr:convertDateTime pattern="EEEEEEEEE, ddMMMyyyy, HH:mm:ss z"/>
                  </tr:inputText>
                </tr:panelFormLayout>
              </tr:panelHeader>
            </tr:showDetailItem>
          </tr:panelTabbed>      
      </tr:form>
    </tr:panelGroupLayout>


  </ui:define>
</ui:composition>
</html>
